import {
    ElDialog
} from 'element-plus' ;

import {
    native as render,
    inject
} from 'zbee-ui-renderer' ;

import getButtons from './buttons';

export default {

    props:{

        title:{
            type:String
        },

        items:{},
        buttons:{}
    },

    emits:[
        'close',
        'apply',
        'cancel'
    ],

    setup(props , {
        emit
    }){

        const {
            title,
            items,
            buttons
        } = props,
        renderItems = inject('tagRenderItems'),
        close = () => emit('close'),
        apply = params => {

            emit('apply' , params) ;

            close() ;

        },
        cancel = () => {

            emit('cancel') ;

            close() ;

        },
        context = inject('widgetContext');

        context.apply = apply,
        context.cancel = cancel ;

        return () => {

            return render({
                data:{
                    widget:ElDialog,
                    title,
                    modelValue:true,
                    items:{
                        isSlots:true,
                        data:{
                            default:() => renderItems(items),
                            footer:getButtons(buttons)
                        }
                    },
                    onClose:{
                        action:'call',
                        function:close
                    }
                }
            }) ;

        } ;

    }

} ;